pub.bind(window, 'load', function () {
    // 获取当前的本地内存是否为true
    var span = document.querySelector('.topbar_register span');
    var i = document.querySelector('.topbar_register i');
    var dls = document.querySelector('.topbar_register .box-tan');
    var out = document.getElementsByClassName('box-tc')[0];
    // console.log(span,i,dls,out);
    if (localStorage.login == 'true') {
        span.style.display = 'none';
        i.style.display = 'block';
        i.onmouseenter = function () {
            dls.style.display = 'block';
            out.onclick = function () {
                localStorage.login = false
                history.go(0);
            }
            dls.onmouseleave = function () {
                dls.style.display = 'none';
            }
        }
    } else {
        span.style.display = 'block';
        i.style.display = 'none';
    }
    // 鼠标移到课程，显示付费和机构选项
    var searchbox = document.querySelector('.searchbox_course');
    var sul = document.querySelector('.searchbox_course ul');
    var i = document.querySelector('.searchbox_course i');
    // console.log(searchbox,sul,i);
    searchbox.onmouseenter = function () {
        sul.style.display = 'block';
        i.style.transform = 'rotate(-90deg)';
    }
    searchbox.onmouseleave = function () {
        sul.style.display = 'none';
        i.style.transform = '';
    }

    // 渲染页面详情图加右侧的课件具体信息部分
    /* var lxboxHead = document.querySelector('.lxbox-head');
    // console.log(lxboxHead);
    var lx = '';
    var vd = videoDetail;
    lx += ' <div class="lxbox-img"><a href="#"><img src="' + vd.poster + '" alt=""></a></div>\
<div class="lxbox-bd clearfix">\
    <div class="lxbox-layout clearfix">\
    <h2>['+ vd.year + ']' + vd.title + '</h2>\
    <ul>\
        <li>年级科目:'+ vd.grade + '</li>\
        <li>课时数量: '+ vd.time + '课时</li>\
        <li>开课时间: '+ vd.duration + '</li>\
        <li>有效期至: '+ vd.period + '</li>\
    </ul>\
    <dl>\
        <dt>距报名截止仅剩</dt>\
        <dd> <b>'+ vd.day + '</b> 天 <b>' + vd.h + '</b> 时 <b>' + vd.m + '</b> 分 <b>' + vd.s + '</b> 秒 </dd>\
    </dl>\
    <p class="clearfix">\
        <span>&yen;'+ vd.price + '</span>\
        <a href="">'+ (vd.isFree ? '免费学习' : '付费学习') + '</a>\
    </p>\
    <div class="clearfix  lxbox-anniu">\
        <a href="" class="lxbox-dan">&yen;'+ vd.singlePrice + '单独购买</a>\
        <i>|</i>\
        <a href="" class="lxbox-tuan">&yen;'+ vd.group + '拼团</a>\
    </div>\
    </div>\
 </div>'
    lxboxHead.innerHTML = lx; */

    var vd = videoDetail;
    // 渲染师资信息部分
    var lxboxShizhi = document.querySelector('.lxbox-shizhi');
    //  console.log(lxboxShizhi);
    var lxs = '';
    lxs += ' <h2>授课师资</h2>\
 <div class="lxbox-xinxi clearfix">\
     <span>\
         <dl>\
             <dt>'+ vd.teacher + '</dt>\
             <dd>'+ vd.teacherTitle + ' </dd>\
         </dl>\
     </span>\
     <i></i>\
     <p>'+ vd.introduce + '</p>\
 </div>';
    lxboxShizhi.innerHTML = lxs;

    //  渲染主体部分
    var layout2 = document.querySelector('.layout2');
    //  console.log(layout2);
    var cl = classList;
    var ll = classList[0].list
    //  console.log(layout2,cl,ll);
    var lay = '';
    for (var i = 0; i < cl.length; i++) {
        var d = cl[i].list;
        //  console.log(d);
        var a = '';
        for (var j = 0; j < d.length; j++) {
            console.log(d.length);
            a += '<li class="clearfix"><i class="iconfont icon-24gf-playCircle"></i><span>' + d[j].name + '</span><a href="#">' + d[j].time + '开播</a></li>'
            // console.log(lay);
        }
        lay += '<h3>' + cl[i].title + '(含' + cl[i].num + '期) <i class="iconfont icon-shangjiantou"></i> </h3><ol class="clearfix">' + a + '</ol>';
    }
    layout2.innerHTML = lay;


    var ols = layout2.querySelectorAll('ol');
    var is = layout2.querySelectorAll('h3 i');
    console.log(ols, is);
    for(var i=0;i<ols.length;i++){
        if(i<=2){
            is[i].tag=true;
            is[i].className='iconfont icon-shangjiantou';
            ols[i].style.display='block'
        }else{
            is[i].tag=false;
            is[i].className='iconfont icon-xiajiantou';
            ols[i].style.display='none'
        }
    }
    var pa=document.querySelector('.dianji');
    console.log(pa);
     
    for(var i=0;i<is.length;i++){
        is[i].index=i;
        is[i].onclick=function(){
            console.log(this.tag);
            if(this.tag){
                ols[this.index].style.display='none';
                this.className='iconfont icon-xiajiantou';
            }else{
                ols[this.index].style.display='block';
                this.className='iconfont icon-shangjiantou'
            }
        
        this.tag = !this.tag;
        // 判断是否所有的i标签的状态都是展开的，如果是 地下的P中的文字 变为：点击收起全部

        for(var j=0;j<is.length;j++){
            if(is[j].tag==false){
                pa.innerHTML='点击展开全部';
                return;
            }
        }
        pa.innerHTML='点击收起全部';
        }
    }
    // 点击a标签 展开或者收起全部ol
    pa.onclick=function(){
        if(pa.innerHTML=='点击展开全部'){
            for(var i=0;i<is.length;i++){
                is[i].tag=true;
                is[i].className='iconfont icon-shangjiantou';
                ols[i].style.display='block'
            }
            pa.innerHTML='点击收起全部';
        }else{
            for(var i=0;i<is.length;i++){
                is[i].tag=false;
                is[i].className='iconfont icon-xiajiantou';
                ols[i].style.display='none'
            }
            pa.innerHTML='点击展开全部'
        }
    };
    var ulis=document.querySelectorAll('.lxbd-hd li');
    console.log(ulis);
    ulis[0].onclick=ulis[1].onclick=function(){
        layout2.style.display='block' ;
        for(var i=0;i<ulis.length;i++){
            ulis[i].className=''
        }
        this.className='active';
    };

    // 渲染视频右侧信息
    var lbbd = document.querySelector('.lb-bd');
     console.log(lbbd);
    var cl = classList;
    var ll = classList[0].list
    //  console.log(layout2,cl,ll);
    var sty='';
    for (var i = 0; i < cl.length; i++) {
        var d = cl[i].list;
        var a = '';
        for (var j = 0; j < d.length; j++) {
            a += '<li class="clearfix"><span>'+d[j].name+'</span><i class="iconfont icon-24gf-playCircle"></i></li>'
        }
        sty += '<h3>' + cl[i].title + '(含' + cl[i].num + '期)</h3><ol class="clearfix">' + a + '</ol>';
    }
    lbbd.innerHTML = sty;

    // 渲染视频右侧评论信息
    var lbpl=document.querySelector('.lb-pl');
    var lbplul=document.querySelector('.lb-pl ul');
    var cm=commentList;
    var sty1='';
    for(var i=0;i<cm.length;i++){
        sty1+='<li class="lb-list">\
                <div><span><img src="'+cm[i].src+'"></span>\
                <span>'+cm[i].name+'</span><i>'+cm[i].time+'</i></div>\
                <p>'+cm[i].content+'</p>\
            </li>'
    }
    lbplul.innerHTML=sty1;

    // 视频右侧目录和讨论
    var spans = document.querySelectorAll('.lb-bt span');
     console.log(spans);
     spans[0].onclick=function(){
        lbbd.style.display='block';
        this.className='active';
        spans[1].className='none';
        lbpl.style.display='none'
     }
     spans[1].onclick=function(){
        lbbd.style.display='none';
        lbpl.style.display='block';
        this.className='active';
        spans[0].className='none';
     }
     var ulis=document.querySelectorAll('.lxbd-hd li');
     var xq=document.querySelector('.lh-xq')
     console.log(ulis,xq);
     // 点击课程目录显示相应课程信息
     ulis[0].onclick=function(){
         pa.style.display='block' ;
         layout2.style.display='block' ;
         xq.style.display='none' ;
         for(var i=0;i<ulis.length;i++){
             ulis[i].className=''
         }
         this.className='active';
     };
     // 点击课程详情显示相应内容
    ulis[1].onclick=function(){
        layout2.style.display='none' ;
        pa.style.display='none' ;
        xq.style.display='block' ;
        for(var i=0;i<ulis.length;i++){
            ulis[i].className=''
        }
        this.className='active';
    }
    // 渲染课程详情
    // console.log(classImgList);
        var sty='';
        sty+='<img src="'+classImgList[0]+'" alt="">';
        xq.innerHTML=sty;
})